<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="author" content="lijinbo" />
    <meta name="cdnload" content="vue,element-ui-js,element-ui-css" />
    <title>025-模拟银行</title>
    <style></style>
  </head>

  <body>
    <div id="app">
      <div class="box">
        <el-form label-width="100px">
          <el-form-item label="账户名称">
            <el-input v-model.trim="user.name"></el-input>
          </el-form-item>
          <el-form-item label="初始金额">
            <el-input-number v-model="user.initMoney" :min="0"></el-input-number>
          </el-form-item>
          <el-form-item label="利率">
            <el-input-number v-model="user.rate" :min="0.1" :step="0.1"></el-input-number>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="createAccount">创建账户</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div>
        <p>时间： 第 {{ currentDate }} 天</p>
      </div>
      <div id="accountList">
        <div v-for="(item,index) in accountList" :key="index" class="show_user_box">
          <div>
            <el-input-number v-model="money" :min="0"></el-input-number>
            <button @click="deposit(item)">存入</button>
            <button @click="withdraw(item)">取出</button>
          </div>
          <p>账户：{{ item.userName }}</p>
          <p>余额：{{ item.balance }}</p>
          <el-table :data="item.orderList" style="width: 100%">
            <el-table-column prop="date" label="时间"></el-table-column>
            <el-table-column prop="amount" label="金额"></el-table-column>
            <el-table-column prop="interestSum" label="总利息"></el-table-column>
            <el-table-column prop="interestSum" label="本息合计"></el-table-column>
          </el-table>
        </div>
      </div>
    </div>
    <script type="module" src="./025-main.js"></script>
  </body>
</html>
